const path = require("path");
const { CleanWebpackPlugin } = require("clean-webpack-plugin");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const webpack = require("webpack");

module.exports = {
  entry: {
    index: "./src/index.js",
  },
  plugins: [
    // 对于 CleanWebpackPlugin 的 v2 versions 以下版本，使用 new CleanWebpackPlugin(['dist/*'])
    new CleanWebpackPlugin({ cleanStaleWebpackAssets: false }), //  watch 触发增量构建后不删除 index.html 文件
    new HtmlWebpackPlugin({
      title: "管理输出",
    }),
    // Shimming 预置全局变量
    new webpack.ProvidePlugin({
      _: "lodash",
    }),
  ],
  output: {
    filename: "[name].bundle.js",
    path: path.resolve(__dirname, "dist"),
    publicPath: "/", // 确保文件资源能够正确地 serve 在 http://localhost:3000 下
    pathinfo: false, // 输出结果不携带路径信息
  },
  // module: {
  //   rules: [
  //     {
  //       test: /\.css$/,
  //       include: path.resolve(__dirname, "src"),
  //       // use: [MiniCssExtractPlugin.loader, "css-loader"],
  //       use: ["style-loader", "css-loader"],
  //     },
  //     {
  //       test: /\.less$/,
  //       include: path.resolve(__dirname, "src"),
  //       use: [
  //         {
  //           loader: "style-loader",
  //         },
  //         {
  //           loader: "css-loader",
  //         },
  //         {
  //           loader: "less-loader",
  //           options: {
  //             lessOptions: {
  //               strictMath: true,
  //             },
  //           },
  //         },
  //       ],
  //     },
  //     {
  //       test: /\.(png|svg|jpg|gif)$/,
  //       include: path.resolve(__dirname, "src"),
  //       use: [
  //         "file-loader",
  //         {
  //           loader: "image-webpack-loader", // 压缩优化图片
  //           options: {
  //             bypassOnDebug: true, // webpack@1.x
  //             disable: true, // webpack@2.x and newer
  //           },
  //         },
  //       ],
  //     },
  //   ],
  // },
  // optimization: {
  //   // optimization.minimizer: 覆盖 webpack 默认提供的优化器 压缩css
  //   minimizer: [new TerserJSPlugin({}), new OptimizeCSSAssetsPlugin({})],
  //   // 分离公共依赖
  //   splitChunks: {
  //     chunks: "async",
  //     cacheGroups: {
  //       vendor: {
  //         test: /[\\/]node_modules[\\/]/,
  //         name: "vendors",
  //         chunks: "all",
  //       },
  //     },
  //   },
  //   // 将 runtime 代码拆分为一个单独的 chunk
  //   runtimeChunk: "single",
  //   // 前后两次构建，vendor hash 保持一致
  //   moduleIds: "hashed",
  // },
};
